<style>
#nav-foot {
position: fixed;
bottom: -15px;
left: 0px;
right: 0px;
height: 80px;/* top2bottom 80-15-20=45 */
background: #dbdd88;
overflow:hidden;
border-radius:20px;
border:1px solid gainsboro;
text-align: center;
}
#nav-foot > div > a {display:flex;flex-flow:row wrap;align-items:center;justify-content:center;padding:0 18px}
#nav-foot > div > a > * {padding:0 6px}
</style>
<div id="nav-foot" class="width-limit">
    <div class="hbox childs-flex-grow" style="margin:6px 4%;width:92%;height:50px;color:#333">
        <a href="index.html"><i class="fa fa-home fa-2x"></i><div>首页</div></a>
        <a href="classify.html"><i class="fa fa-list-ul fa-2x"></i><div>分类</div></a>
        <a href="news.html"><i class="fa fa-paper-plane fa-2x"></i><div>动态</div></a>
        <a href="user.html"><i class="fa fa-user fa-2x"></i><div>我的</div></a>
    </div>
</div>